<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	template="/layout/template.xhtml">

	<ui:define name="body">


		<style>
.box {
	border: 0px solid #ccc;
	padding: 10px;
}

.box:hover {
	background-color: #E8F6FF;
}

.box div:hover { /*-moz-box-shadow: 0 0 5px #85B2CB;
	background: -moz-linear-gradient(center top, rgba(255, 255, 255, 0.6),
		rgba(255, 255, 255, 0) ) repeat scroll 0 0 #85B2CB;
	border: 1px solid #7096AB;
	color: #313131;*/ /*background-color: #E8F655;*/
	
}

/*.ui-datatable-data td:hover {
	background-color: #E8F6FF;
}
*/
.moreops { /*border: 1px solid #A8A8A8;
	color: #4F4F4F;*/
	padding: 4px 10px;
	float: right;
	visibility: hidden;
	cursor: pointer;
}

ul,li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.menu_class {
	border: 1px solid #1c1c1c;
}

.the_menu {
	display: none;
	width: 200px;
	border: 1px solid #1c1c1c;
	position: absolute;
}

.the_menu li {
	background-color: #302f2f;
}

.the_menu li a {
	color: #FFFFFF;
	text-decoration: none;
	padding: 10px;
	display: block;
}

.the_menu li a:hover {
	padding: 10px;
	font-weight: bold;
	color: #F00880;
}
</style>
		<h:form id="fileForm" prependId="false">
			<p:toolbar>
				<p:toolbarGroup align="left" styleClass="deneme">
					<p:commandButton type="button" value="New Folder"
						image="ui-icon-document" styleClass="customGreenButton"
						onclick="newFolderModal.show();" />

					<p:commandButton type="button" value="Upload"
						onclick="fileUploadModal.show();" styleClass="customRedButton"
						image="ui-icon-folder-open" />



				</p:toolbarGroup>
				<p:toolbarGroup align="right" styleClass="deneme">
					<p:commandButton type="button" styleClass="customGreenButton"
						title="Shared Folders" value="Shared Folders"
						image="ui-icon-person" />
					<p:divider />
					<p:commandButton id="toolMoreButton" styleClass="customGreyButton"
						value="More" title="More" type="button"
						image="ui-icon-triangle-1-s" />
					<p:menu position="dynamic" trigger="toolMoreButton" my="left top"
						at="left bottom">
						<p:menuitem value="Delete" update="messages,fileTable"
							actionListener="#{homeBean.deleteSelectedFiles}" icon="delete" />
						<p:menuitem value="Update" update="messages"
							icon="ui-icon ui-icon-arrowrefresh-1-w" />
					</p:menu>
				</p:toolbarGroup>
				<p:divider />
			</p:toolbar>
			<p:menubar id="menuBar">
				<p:submenu>
					<f:facet name="label">
						<p:menuitem value="Up" update="fileTable,menuBar" icon="upFolder"
							ajax="false" style="margin-left:15px;padding-top:10px;"
							disabled="#{empty homeBean.tableRoot.parentNodeRef}">
							<f:setPropertyActionListener value="#{homeBean.tableRoot}"
								target="#{homeBean.selectedRoot}" />
						</p:menuitem>
					</f:facet>
				</p:submenu>
			</p:menubar>
			<p:outputPanel id="filePanel">
				<p:dataTable id="fileTable" value="#{homeBean.childFolders}"
					emptyMessage="No file found" paginatorPosition="bottom"
					paginator="true" var="file" rows="5"
					selection="#{homeBean.selectedFiles}" rowStyleClass="tableRow"
					paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropDown}">
					<p:column selectionMode="multiple" />
					<p:column>
						<ui:decorate template="/layout/common/display.xhtml">
							<ui:define name="label">
								<p:graphicImage width="64" height="64"
									value="#{file.folderType}" />
								<!--											value="../img/folder-types/pdf.gif" />-->
							</ui:define>
							<h:panelGrid columns="2" style="text-align:left;">
								<!--							<h:link style="color:#4F94C9;font-size: 16px;"-->
								<!--							value="#{file.name}" outcome="index"/>-->
								<h:commandLink value="#{file.name}" id="fileNameLink"
									title="#{file.name}"
									style="color:#4F94C9;font-size: 16px;float:left;width:90px;">
									<f:setPropertyActionListener value="#{file}"
										target="#{homeBean.tableRoot}" />
								</h:commandLink>
								<!--									<f:setPropertyActionListener value="#{file}"-->
								<!--										target="#{homeBean.selectedFile}" />-->
								<p:graphicImage id="infoButton"
									value="../img/special/24/info_24.png"
									onclick="#{rich:component('infoTip')}.show(event);"
									style="cursor:pointer;" width="18px" height="18px" />
										kolon1 : kolon2
								<p:commandLink onclick="detailModal.show();">
									<p:graphicImage value="../img/special/star_full.png"
										width="18px" height="18px" />
								</p:commandLink>
								<!--								<rich:tooltip target="fileNameLink">-->
								<!--									<h:outputLabel value="#{file.name}" />-->
								<!--								</rich:tooltip>-->
								<rich:tooltip attached="false" id="infoTip" showEvent="click"
									followMouse="false" direction="auto" hideEvent="none"
									layout="block">
									<div
										style="width: 100%; height: 20px; border-bottom-style: dotted; border-width: 1px;">
									<h:outputLabel value="#{file.name}" style="float:left;" /> <h:graphicImage
										style="float:right;cursor:pointer" width="12" height="12"
										onclick="#{rich:component('infoTip')}.hide(event);"
										value="../img/special/delete.png" /></div>
									<h:panelGrid columns="2">
										<p:graphicImage width="32" height="32"
											value="#{file.folderType}" />
										<h:panelGrid columns="2">
											<h:outputText value="Login" />
											<h:inputText />
											<h:outputText value="Password" />
											<h:inputText />
										</h:panelGrid>
									</h:panelGrid>
								</rich:tooltip>
							</h:panelGrid>
						</ui:decorate>
						<p:menuButton id="moreButton" widgetVar="moreButton"
							value="More..." appendToBody="true"
							style="float:right;margin-top:10px;">
							<p:menuitem value="Download" disabled="#{file.container}"
								icon="download" style="vertical-align:middle;"
								styleClass="menu-item">
								<f:setPropertyActionListener value="#{file}"
									target="#{homeBean.selectedFile}" />
							</p:menuitem>
							<p:menuitem value="Delete"
								oncomplete="deleteConfirmModal.show();" icon="delete"
								styleClass="menu-item" update="fileTable">
								<f:setPropertyActionListener value="#{file}"
									target="#{homeBean.selectedFile}" />
							</p:menuitem>
							<p:menuitem value="Move to..."
								oncomplete="moveChooseModal.show();" styleClass="menu-item">
								<f:setPropertyActionListener value="#{file}"
									target="#{homeBean.selectedFile}" />
							</p:menuitem>
							<p:menuitem value="Copy to..."
								oncomplete="copyChooseModal.show();" styleClass="menu-item">
								<f:setPropertyActionListener value="#{file}"
									target="#{homeBean.selectedFile}" />
							</p:menuitem>
							<p:menuitem value="Update" oncomplete="moveChooseModal.show();"
								styleClass="menu-item">
								<f:setPropertyActionListener value="#{file}"
									target="#{homeBean.selectedFile}" />
							</p:menuitem>
						</p:menuButton>
					</p:column>
				</p:dataTable>
			</p:outputPanel>
			<p:dialog modal="true" header="Create New Folder"
				widgetVar="newFolderModal" resizable="false">
				<p:ajaxStatus style="width:16px;height:16px;">
					<f:facet name="start">
						<h:graphicImage value="../img/ajaxloading.gif" />
					</f:facet>

					<f:facet name="complete">
						<h:outputText value="" />
					</f:facet>
				</p:ajaxStatus>
				<h:panelGrid columns="2" style="margin-bottom:10px">
					<h:outputLabel for="folderName" value="Folder name: *" />
					<h:inputText id="folderName" label="folder name"
						value="#{homeBean.folderName}" />
				</h:panelGrid>
				<div style="float: right; margin-right: 15px;"><p:commandButton
					value="Create" styleClass="customBlueButton" process="folderName"
					update="folderName,fileTable" oncomplete="newFolderModal.hide();"
					action="#{homeBean.createNewFolder}" /> <p:commandButton
					styleClass="customGreyButton" value="Cancel" type="button"
					onclick="newFolderModal.hide();" /></div>
			</p:dialog>
		</h:form>
		<br />
		<br />
		<br />
		<br />
		<br />
		<p:confirmDialog id="deleteConfirmModal" modal="true"
			widgetVar="deleteConfirmModal" header="Confirmation"
			message="Do you really want to delete #{homeBean.selectedFile.name}?">
			<p:ajaxStatus style="width:16px;height:16px;">
				<f:facet name="start">
					<h:graphicImage value="../img/ajaxloading.gif" />
				</f:facet>

				<f:facet name="complete">
					<h:outputText value="" />
				</f:facet>
			</p:ajaxStatus>
			<h:form>
				<div style="float: right; margin-right: 15px;"><p:commandButton
					value="Delete" styleClass="customBlueButton" update="filePanel"
					oncomplete="deleteConfirmModal.hide();"
					action="#{homeBean.deleteFile}" /> <p:commandButton
					styleClass="customGreyButton" value="Cancel" type="button"
					onclick="deleteConfirmModal.hide();" /></div>
			</h:form>
		</p:confirmDialog>


		<p:dialog modal="true" header="Select Directory" minHeight="300"
			minWidth="500" widgetVar="copyChooseModal" resizable="true">
			<p:ajaxStatus style="width:16px;height:16px;">
				<f:facet name="start">
					<h:graphicImage value="../img/ajaxloading.gif" />
				</f:facet>

				<f:facet name="complete">
					<h:outputText value="" />
				</f:facet>
			</p:ajaxStatus>
			<h:form>
				<p:tree id="tree" value="#{homeBean.treeRoot}" var="node"
					style="border:0px;" dynamic="true" cache="true"
					selectionMode="single" expanded="true"
					selection="#{homeBean.selectedNode}">
					<p:ajax event="expand" update="messages,treeNode"
						listener="#{homeBean.onNodeExpanded}" />
					<!--					<p:ajax event="select" update="messages" />-->
					<p:treeNode id="treeNode">
						<h:outputText value="#{node.name}" />
					</p:treeNode>
					<p:treeNode type="document">
						<h:outputText value="#{node.name}" styleClass="documentStyle" />
					</p:treeNode>
				</p:tree>
				<div class="bottomDiv">
				<div style="float: right; margin-right: 15px;"><p:commandButton
					id="copyActionBtn"
					onstart="#{p:widgetVar('copyCancelBtn')}.disable(),#{p:widgetVar('copyActionBtn')}.disable()"
					oncomplete="copyChooseModal.hide();" value="Copy"
					styleClass="customBlueButton" update="messages"
					action="#{homeBean.copyTo}" /> <p:commandButton id="copyCancelBtn"
					styleClass="customGreyButton" value="Cancel" type="button"
					onclick="copyChooseModal.hide();" /></div>
				</div>
			</h:form>
		</p:dialog>
		<p:dialog modal="true" header="Select Directory" minHeight="300"
			minWidth="500" widgetVar="moveChooseModal" resizable="true">
			<p:ajaxStatus style="width:16px;height:16px;">
				<f:facet name="start">
					<h:graphicImage value="../img/ajaxloading.gif" />
				</f:facet>

				<f:facet name="complete">
					<h:outputText value="" />
				</f:facet>
			</p:ajaxStatus>
			<h:form>
				<p:tree id="tree" value="#{homeBean.treeRoot}" var="node"
					style="border:0px;" dynamic="true" cache="false"
					selectionMode="single" expanded="true"
					selection="#{homeBean.selectedNode}">
					<p:ajax event="expand" update="messages,treeNode"
						listener="#{homeBean.onNodeExpanded}" />
					<p:ajax event="select" update="messages" />
					<p:treeNode id="treeNode">
						<h:outputText value="#{node.name}" />
					</p:treeNode>
					<p:treeNode type="document">
						<h:outputText value="#{node.name}" styleClass="documentStyle" />
					</p:treeNode>
				</p:tree>
				<div class="bottomDiv">
				<div style="float: right; margin-right: 15px;"><p:commandButton
					id="moveActionBtn"
					onstart="#{p:widgetVar('moveCancelBtn')}.disable(),#{p:widgetVar('moveActionBtn')}.disable()"
					value="Move" styleClass="customBlueButton" update="filePanel"
					oncomplete="moveChooseModal.hide();" action="#{homeBean.moveTo}" />
				<p:commandButton id="moveCancelBtn" styleClass="customGreyButton"
					value="Cancel" type="button" onclick="moveChooseModal.hide();" />
				</div>
				</div>
			</h:form>
		</p:dialog>

		<p:dialog modal="true" header="File Select" minHeight="300"
			minWidth="500" widgetVar="fileUploadModal" resizable="true">
			<p:ajaxStatus style="width:16px;height:16px;">
				<f:facet name="start">
					<h:graphicImage value="../img/ajaxloading.gif" />
				</f:facet>

				<f:facet name="complete">
					<h:outputText value="" />
				</f:facet>
			</p:ajaxStatus>
			<h:form enctype="multipart/form-data">

				<p:fileUpload widgetVar="fileUploader"
					fileUploadListener="#{homeBean.handleFileUpload}"
					cancelLabel="İptal" uploadLabel="Hepsini Yükle" mode="advanced"
					label="Ekle" update="fileTable" multiple="true" />

				<!--					<p:fileUpload value="#{homeBean.uploadedFile}" mode="simple"/> -->
				<!---->
				<!--					<p:growl id="messages" showDetail="true" />-->
				<!--<p:commandButton value="Submit" ajax="false"  -->
				<!--                actionListener="#{homeBean.simpleUpload}"/>  -->

				<!--				<p:commandLink id="dynaButton" value="Show" type="button" />-->
				<!--				<p:menu position="dynamic" trigger="dynaButton" my="left top"-->
				<!--					at="left bottom">-->
				<!--					<p:menuitem value="Save" update="messages"-->
				<!--						icon="ui-icon ui-icon-disk" />-->
				<!--					<p:menuitem value="Update" update="messages"-->
				<!--						icon="ui-icon ui-icon-arrowrefresh-1-w" />-->
				<!--				</p:menu>-->


			</h:form>
			<div class="bottomDiv" style="margin-top: 20px;">
			<div style="float: right; margin-right: 15px;"><p:commandButton
				id="moveCancelBtn" styleClass="customGreyButton" value="Done"
				type="button" onclick="fileUploadModal.hide();" /></div>
			</div>
		</p:dialog>




	</ui:define>
</ui:composition>
